<template>
  <div class="login_img">
    <div class="windeg center">
      <div class="text center">
        <formCard />
      </div>
    </div>
  </div>
</template>

<script lang="ts" setup>
import formCard from './cop/formCard.vue'
</script>
<style lang="less" scoped>
.login_img {
  background-image: url('../../assets/img/少女海滩.jpg');
  background-position: 0 -101px;
  display: flex;
  justify-content: center;
  text-align: center;
  -webkit-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  padding-top: 49.2%;
}
// .windeg {
//   border-top: 2px solid rgba(255, 255, 255, 0.5);
//   border-bottom: 2px solid rgba(255, 255, 255, 0.5);
//   height: 200px;
//   width: 100%;
//   overflow: hidden;
// }
.center {
  position: absolute;
  margin: auto;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.text {
  height: 200px;
  width: 340px;
}
.text h1 {
  text-align: center;
  text-shadow: 1px 1px rgba(0, 0, 0, 0.1);

  color: #fff;
  margin-top: 57px;
  font-weight: 700;
  font-size: 38px;
}
</style>
